<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="placeholder.js"></script>
        <style type="text/css">/*<![CDATA[*/
            .placeholder {
                color: #aaa;
                text-align: center;
            }
            input::-webkit-input-placeholder {
                text-align: center;
                color: #aaa;
            }
        /*]]>*/</style>
    </head>
    <body>
        <div id="test"></div>
        <form method="POST">
            <p>
                <label for="login-input">Login</label>
                <input type="text" name="login" id="login-input" placeholder="Enter login here" />
            </p>
            <p>
                <label for="password-input">Password</label>
                <input type="password" name="password" id="password-input" placeholder="Enter password here" />
            </p>
            <p>
                <input type="submit" value="Sign in" />
            </p>
        </form>
        <script type="text/javascript">//<![CDATA[
            var inputs = document.getElementsByTagName('input');
            for (var i = 0; i < inputs.length; i ++)
                Placeholder.attach(inputs[i]);
        //]]></script>
    </body>
</html>
